<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <link rel="stylesheet" href="../css/homepage/reset.css">
  <link rel="stylesheet" href="../icon-font/iconfont.css">
  <link rel="stylesheet" href="../css/homepage/header.css">
  <link rel="stylesheet" href="../css/loginpage/login.css">
</head>

<body>
  <header id="head">
    <div class="wrapper">
      <div class="logo">
        <a href="../html/littleDuck.html"></a>
      </div>
      <!-- 导航 -->
      <nav>
        <ul>
          <li><a href="../html/littleDuck_list.html">全部商品</a></li>
          <li><a href="./littleDuck_list.html?kw=滚筒洗衣机">滚筒洗衣机</a></li>
          <li><a href="./littleDuck_list.html?kw=洗烘套装">洗烘套装</a></li>
          <li><a href="./littleDuck_list.html?kw=波轮洗衣机">波轮洗衣机</a></li>
          <li><a href="../html/littleDuck_list.html?kw=洗烘一体机">洗烘一体机</a></li>
          <li><a href="../html/littleDuck_list.html?kw=干衣机">干衣机</a></li>
          <li><a href="">洗护产品</a></li>
        </ul>
      </nav>
      <div class="seach-box">
        <input class="seach-inp" type="text" placeholder="人气热销">
        <span class="iconfont icon-sousuoxiao"></span>
      </div>
      <div class="user_list">
        <a class="iconfont_user">
          <i class="user_icon"></i>
        </a>
        <a href="" class="user_img">
          <img src="../img/ls_avatar_120.png" alt="">
        </a>
        <ul>
          <li><a href="">我的订单</a></li>
          <li><a href="">我的优惠券</a></li>
          <li><a class="user_set">账户设置</a></li>
          <li class="login_item"><a class="out">退出登入</a></li>
        </ul>
      </div>
      <div class="user_cart">
        <a class="iconfont_cart">
          <i class="cart_icon"></i>
          <span class="cart_icon_num">0</span>
        </a>
        <div>
          <p class="cart_out_tip">立即<a href="./login.html">登入</a>，查看购物车商品</p>
          <p class="cart_icon_tip">购物车中还没有商品，赶紧选购吧</p>
        </div>
      </div>
    </div>
    <!-- 商品顶部二级导航 -->
    <div class="nav-items">
      <ul>
        <li>
          <a href="">
            <img src="../img/a7bfe36fbfe949339f995b1837006809.jpg" alt="">
            <p>【送七年电机保修金卡】小天鹅10KG滚筒洗衣机 水魔方冷水洗涤 TG100VT86WMAD5</p>
          </a>
        </li>
        <li>
          <a href="">
            <img src="" alt="">
            <p></p>
          </a>
        </li>
        <li>
          <a href="">
            <img src="" alt="">
            <p></p>
          </a>
        </li>
        <li>
          <a href="">
            <img src="" alt="">
            <p></p>
          </a>
        </li>
        <li>
          <a href="">
            <img src="" alt="">
            <p></p>
          </a>
        </li>
        <li>
          <a href="">
            <img src="" alt="">
            <p></p>
          </a>
        </li>

      </ul>
    </div>
  </header>

  <main>
    <!-- 登入注册 -->
    <div class="wrapper login">
      <div class="activity_img">
        <img src="../img/7a616596f626.jpg@100Q.jpg" alt="">
      </div>
      <!-- 账号密码登入 -->
      <div class="login_wrap login_pwd_box">
        <form action="" type="post">
          <p class="login_form_tit">账号密码登入</p>
          <div class="login_form_iphone">
            <input type="text" class="login_telephone input_item" name="mobile" placeholder="手机号">
            <div class="inp_err_tip tel_err_tip">请输入正确密码</div>
          </div>
          <div class="login_form_pad">
            <input type="password" class="login_password input_item" placeholder="密码" name="passwd">
            <div class="inp_err_tip pwd_err_tip"></div>
          </div>
          <a class="login_btn">登入</a>
          <div class="login_links">
            <a class="login_msg_link">短信验证登入</a>
            <span>|</span>
            <a class="login_reg_link">注册</a>
            <a class="login_find_link">找回密码</a>
          </div>
        </form>
      </div>

      <!-- 短信验证登入 -->
      <div class="login_wrap login_mag login_mag_box">
        <form action="">
          <p class="login_form_tit">短信验证码登入</p>
          <div class="login_form_iphone">
            <input type="text" class="login_telephone input_item" name="mobile" placeholder="手机号">
            <a href="" class="login_get_code">获取验证码</a>
            <div class="inp_err_tip tel_err_tip">请输入正确手机号</div>
          </div>
          <div class="login_form_code">
            <input type="text" class="login_password input_item" placeholder="短信验证码" name="passwd">
            <div class="inp_err_tip code_err_tip">请输入正确密码</div>
          </div>

          <a class="login_btn">登入</a>
          <div class="login_links">
            <a class="login_pwd_link">账号密码登入</a>
            <span>|</span>
            <a class="login_reg_link">注册</a>
            <a class="login_find_link">找回密码</a>
          </div>
        </form>
      </div>

      <!-- 账号注册 -->
      <div class="login_wrap login_mag reg_style reg_box">
        <form action="">
          <p class="login_form_tit reg_form_tit">使用手机号注册</p>
          <div class="login_form_iphone">
            <input type="text" class="login_telephone input_item" name="mobile" placeholder="手机号">
            <a class="login_get_code">获取验证码</a>
            <div class="inp_err_tip tel_err_tip">请输入正确手机号</div>
          </div>
          <div class="login_form_code">
            <input type="text" class="login_code input_item" placeholder="短信验证码" name="passwd">
            <div class="inp_err_tip code_err_tip">请输入正确密码</div>
          </div>
          <div class="login_form_pad">
            <input type="password" class="login_password input_item" placeholder="密码" name="passwd">
            <div class="inp_err_tip pwd_err_tip">请输入正确密码</div>
          </div>
          <div class="login_form_nextpad">
            <input type="password" class="login_nextpassword input_item" placeholder="确认密码" name="passwd">
            <div class="inp_err_tip nextpwd_err_tip">请输入正确密码</div>
          </div>
          <span class="pwd_tips">密码由6-20位英文字母、数字或者符号组成</span>
          <div class="reg_slide_track">
            <span class="reg_slide_tip">请按住滑块拖到最右边</span> 
            <span class="slide_err_tip">验证失败</span>
            <div class="reg_slide_lump">>></div>
          </div>
          <a class="login_btn">注册</a>
          <div class="login_links">
            <a class="reg_link login_pwd_link">已有账号?请登入</a>
          </div>
        </form>
      </div>
    </div>

    <!-- 找回密码 -->
    <div class="wrapper findPwd">
      <div class="login_wrap login_mag reg_style findPwd_box">
        <form action="">
          <p class="login_form_tit reg_form_tit
          findPwd_tit">找回密码</p>
          <div class="login_form_iphone">
            <input type="text" class="findPwd_telephone input_item" name="mobile" placeholder="请输入注册的手机号">
            <a href="" class="login_get_code">获取验证码</a>
            <div class="inp_err_tip tel_err_tip">请输入正确手机号</div>
          </div>
          <div class="login_form_code">
            <input type="text" class="findPwd_code input_item" placeholder="短信验证码" name="passwd">
            <div class="inp_err_tip code_err_tip">请输入正确密码</div>
          </div>
          <div class="login_form_pad">
            <input type="text" class="findPwd_password input_item" placeholder="请输入密码" name="passwd">
            <div class="inp_err_tip pwd_err_tip">请输入正确密码</div>
          </div>
          <div class="login_form_nextpad">
            <input type="text" class="findPwd_password input_item" placeholder="确认密码" name="passwd">
            <div class="inp_err_tip nextpwd_err_tip">请输入正确密码</div>
          </div>
          <span class="pwd_tips">密码由6-20位英文字母、数字或者符号组成</span>
          <a class="login_btn">确认提交</a>
          <div class="login_links">
            <a class="login_pwd_link">去登入</a>
          </div>
        </form>
      </div>
    </div>

  </main>

  <footer>
    <p>版权所有 © 无锡小天鹅股份有限公司|苏ICP备14025600号-1</p>
  </footer>
  <script src="../js/jquery.min.js"></script>
  <script src="../js/promise_ajax.js"></script>
  <script src="../js/api.js"></script>
  <script src="../js/login.js"></script>
  <script src="../js/header.js"></script>
</body>

</html>